<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>

		<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
		<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
		<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

<script type="text/javascript" src="<%=basePath%>Js/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="<%=basePath%>css/mycss/bootstrap.min.css" />
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">

//通过员工编号查询员工
function selectStafByNumber(){
	var number = $("#stafNumber").val();
    if(number != ""){
    	window.location.href="selectStfByNumber.do?number="+number;
    	
			
    }else{
    	alert("查询条件为空！")
    }
}

//通过员工姓名查询员工
function selectStafByname(){
	
	var stafName = $("#inpstafName").val();
	if(stafName == null || stafName == ""){
		window.location.href="queryStaff.do";
	}else{
		
		window.location.href="selectStafByname.do?stafName="+stafName;
		
	}
	
}

//修改员工信息
function xiugaiStaf(){

	var stafNumber = $("#stafNumber2").val();
	var stafName = $("#stafName2").val();
	var stafIdNumber = $("#stafIdNumber2").val();
	var staAddress = $("#staAddress2").val();
	var stafJobtitle = $("#stafJobtitle2").val();
	var stafGender = $("#stafGender2").val();
	var stafAge = $("#stafAge2").val();
	var stafWorktime = $("#stafWorktime2").val();
	var stafPhone = $("#stafPhone2").val();
	var remarks = $("#remarks2").val();
	if(confirm("是否确定修改？")){
		$.ajax({
			type:"post",
			url:"updataStaf.do",
			data:{
				"stafName":stafName,
				"stafIdNumber":stafIdNumber,
				"staAddress":staAddress,
				"stafJobtitle":stafJobtitle,
				"stafGender":stafGender,
				"stafAge":stafAge,
				"stafWorktime":stafWorktime,
				"stafPhone":stafPhone,
				"remarks":remarks,
				"stafNumber":stafNumber,
			},
			daataType:"text",
			success:function(result){
				if(result == "1"){
					alert("修改成功")
				}else{
					alert("修改失败")
				}
			},
			error:function(){
				
			}
		})
	}
	
	
	
	
}

//获取员工信息显示在模态框
function amendStafById(id){
	$.ajax({
		type:"post",
		url:"selectStafBykey.do",
		data:{
			"id":id,
		},
		dataType:"text",
		success:function(result){
			stus = JSON.parse(result)
			for(var i = 0; i < stus.length;i++){
				var str = "";
				str +="<table id='stafTble' border='5px' cellspacing='5px' bordercolor='blue' width='570px' height='50px'>";
				str +="<tr><td width='30%' class='tableleft'>员工工号</td>"
				str +="<td><input disabled='disabled' type='text' name='stafNumber' value="+stus[i].number+" id='stafNumber2' class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>姓名</td>"
				str +="<td><input type='text' name='stafName' value="+stus[i].name+" id='stafName2' class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>身份证号</td>"
				str +="<td><input type='text' name='product' id='stafIdNumber2' value="+stus[i].idnumber+" class='form-control' style='width:100%'/></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>居住地址</td>"
				str +="	<td><input type='text' name='classify' id='staAddress2' value="+stus[i].address+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>职称</td>"
				str +="	<td><input type='text' name='classify' id='stafJobtitle2' value="+stus[i].jobtitle+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>性别</td>"
				str +="	<td><input type='text' name='classify' id='stafGender2' value="+stus[i].gender+" class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>年龄</td>"
				str +="<td><input  type='text' name='classify' id='stafAge2' value="+stus[i].age+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>权限</td>"
				str +="<td><input disabled='disabled' type='text' name='classify' id='stafJurisdiction2' value="+stus[i].jurisdiction+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>班次</td>"
				str +="	<td><input type='text' name='classify' id='stafWorktime2' value="+stus[i].worktime+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>入职时间</td>"
				str +="	<td><input disabled='disabled' type='text' name='stafHiredate' id='stafHiredate2' value="+stus[i].reserved1+" class='form-control' style='width:100%'' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>联系电话</td>"
				str +="	<td><input type='text' name='classify' id='stafPhone2' value="+stus[i].phone+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>备注</td>"
				str +="	<td><input type='text' name='classify' value="+stus[i].remarks+" id='remarks2' class='form-control' style='width:100%' /></td></tr>"
				str +="</table>"
	
				
			}
			$("#Inf").empty( );
			$("#Inf").html(str);
			var str2 = "";
			str2 +="<button class='btn btn-warning' onclick='xiugaiStaf()'>修改</button>"
				$("#xiugai").html(str2);
		},
		error:function(){
			alert("数据请求失败")
		}
		
	});
	
}

//查看具体信息
function selectStafBykey(id){
	
	$.ajax({
		type:"post",
		url:"selectStafBykey.do",
		data:{
			"id":id,
		},
		dataType:"text",
		success:function(result){
			stus = JSON.parse(result)
			for(var i = 0; i < stus.length;i++){
				var str = "";
				str +="<table id='stafTble' border='5px' cellspacing='5px' bordercolor='blue' width='570px' height='50px'>";
				str +="	<tr><td width='30%' class='tableleft'>员工工号</td>"
				str +="<td><input disabled='disabled' type='text' name='information' value="+stus[i].number+" id='information' class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>姓名</td>"
				str +="<td><input disabled='disabled' type='text' name='information' value="+stus[i].name+" id='information' class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>身份证号</td>"
				str +="<td><input disabled='disabled' type='text' name='product' id='product' value="+stus[i].idnumber+" class='form-control' style='width:100%'/></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>居住地址</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].address+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>职称</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].jobtitle+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>性别</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].gender+" class='form-control' style='width:100%' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>年龄</td>"
				str +="<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].age+" class='form-control' style='width:100%' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>权限</td>"
				str +="<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].jurisdiction+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>班次</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].worktime+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>入职时间</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].reserved1+" class='form-control' style='width:100%'' /></td></tr>"
				str +="<tr><td width='30%' class='tableleft'>联系电话</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' id='classify' value="+stus[i].phone+" class='form-control' style='width:100%'' /></td></tr>"
				str +="	<tr><td width='30%' class='tableleft'>备注</td>"
				str +="	<td><input disabled='disabled' type='text' name='classify' value="+stus[i].remarks+" id='classify' class='form-control' style='width:100%' /></td></tr>"
				str +="</table>"
	
			}
			$("#xiugai").empty( );
			$("#Inf").html(str);
		},
		error:function(){
			alert("数据请求失败")
		}
		
	});
	
	
}

//删除员工
function deleteStafById(id){
	
	if(confirm("是否确定删除？"))
	{
		$.ajax({
			type:"post",
			url:"deleteStafById.do",
			data:{
				"id":id
				},
				dataType:"text",
				success:function(result){
					if(result == "1"){
						var del = $("#"+id+"");
						del.remove();
						alert("删除成功");
					}else{
						alert("删除失败");
					}
					
					},
				error:function(){
					alert("ajax请求失败");
					}
			})
	}	
}

</script>
<body>
<h1 align="center">员工信息列表</h1><br>
<!-- 条件查询部分 -->
	<table>
		<tr>
			<td><input type="text" name="stafNumber" id="stafNumber"
				class="form-control" placeholder="请输入员工号" value=""></td>
			<td>&nbsp;&nbsp;
				<button class="btn btn-primary" onclick="selectStafByNumber()">查询</button>&nbsp;&nbsp;
			</td>
			<td><input type="text" name="inpstafName" id="inpstafName"
				class="form-control" placeholder="请输入姓名" value=""></td>
			<td>&nbsp;&nbsp;
				<button class="btn btn-primary" onclick="selectStafByname()">查询</button>&nbsp;&nbsp;
			</td>
		</tr>
	</table>
	<br>

<!-- 查询信息显示部分 -->
	<table class="table table-hover" id="table1">
		<tr>
			<th>员工编号</th>
			<th>姓名</th>
			<th>性别</th>
			<th>年龄</th>
			<th>职称</th>
			<th>联系电话</th>
			<th>操作</th>
		</tr>
		<c:forEach items="${pageInfo.list}" var="stalist">
			<tr id="${stalist.id}">
				<td id="number">${stalist.number}</td>
				<td>${stalist.name}</td>
				<td>${stalist.gender}</td>
				<td>${stalist.age}</td>
				<td>${stalist.jobtitle}</td>
				<td>${stalist.phone}</td>
				<td>
					<button type="button" class="btn btn-danger" id="delete"
						onclick="deleteStafById('${stalist.id}')">删除</button> &nbsp;&nbsp;
					<button type="button" class="btn btn-success" id=""
						data-toggle="modal" data-target="#myModal"
						onclick="selectStafBykey('${stalist.id}')">查看详细信息</button>
					&nbsp;&nbsp;
					<button onclick="amendStafById('${stalist.id}')"
						class="btn btn-warning" data-toggle="modal" data-target="#myModal">修改信息</button>
				</td>
			</tr>
		</c:forEach>
	</table>


	<div id="page2"></div>

		<div id="page1">
	<c:if test="${!pageInfo.isFirstPage }">
					<a href="${pageContext.request.contextPath }/queryStaff.do">首页</a>
					<a href="${pageContext.request.contextPath }/queryStaff.do?pageNum=${pageInfo.prePage}">上一页</a>
				</c:if>
				<c:if test="${!pageInfo.isLastPage }">
				<a href="${pageContext.request.contextPath }/queryStaff.do?pageNum=${pageInfo.nextPage}">下一页</a>
				<a href="${pageContext.request.contextPath }/queryStaff.do?pageNum=${pageInfo.lastPage}">末页</a>
				</c:if>
				当前页：${pageInfo.pageNum }/${pageInfo.pages }.
				</div>


				<!-- 模态框（Modal） -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h3 class="modal-title" id="myModalLabel" align="center">
							修改员工信息
						</h3>
					</div>
					<div class="modal-body" id="Inf">
						
					</div>
					<div class="modal-footer" id="xiugai">
					
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal -->
		</div>

</body>
</html>